<script type="text/javascript">
$(function () {
    $("#content_table").jqGrid({
        //url: "example.php",
        datatype: "local",//"xml",
        //mtype: "GET",
        colNames: ["ЕИ", "Шаг", "Комментарий", ""],
        colModel: [        		
            { name: "unit", width: 70,editable:true},
            { name: "increment", width: 70, align: "right" },
            { name: "description", width: 400 },
            { name: "action", width: actionPaneWidth, formatter: formater_row_actions,
                        formatoptions: {  }       
            }
        ],
        //datatype: "jsonstring",
        data:[
        <?php
        $c="";
        while ($row = $content_data["dataset"]->fetch_assoc()) {
        ?>
        	<?php echo $c?>{"id" :"<?php echo $row['unit']?>", "unit" :"<?php echo $row['unit']?>",increment:"<?php echo $row['increment']?>",
        			description:"<?php echo $row['description']?>"}
 				<?php
 					$c=",";
				}
				?>
        ],
        pager: "#pager",
        rowNum: 20,
        rowcontent_table: [10, 20, 30],
        //sortname: "invid",
        //sortorder: "desc",
        viewrecords: true,
        gridview: true,
        autoencode: true,
        caption: "Справочник единиц измерения",
        height:400,
        shrinkToFit:false,
        gridComplete: function(){ 
        	var ids = jQuery("#content_table").jqGrid('getDataIDs'); 
        	return
        	for(var i=0;i < ids.length;i++){ 
       			var cl = ids[i]; 
       			be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"jQuery('#rowed2').editRow('"+cl+"');\" />"; 
       			jQuery("#content_table").jqGrid('setRowData',ids[i],{action:be+se+ce}); 
       		} 
        },
        //editurl: "server.php",
        //width:200
        autowidth:true,
				ondblClickRow:function(rowid, row, col, e){
					openEditDialog(rowid)				
				}
    });
    jQuery("#content_table")
			.navGrid('#pager',{edit:false,add:false,del:false,search:false,refresh:false})
			.navButtonAdd('#pager',{
   		caption:"Добавить", 
   		buttonicon:"ui-icon-plus", 
   		onClickButton: function(){ 
     	  openEditDialog(null)
   		}, 
   		position:"last"
		})

    $("#edit_unit_dialog").dialog({
    	width:400,
    	modal:true,
    	autoOpen:false,
    	title:"Редактировать запись"
    }); 
    $( "input[type=button]" ).button();
    $( "#increment" ).spinner({step:0.1});
}); 
var fieldIds=["unit","increment","description"]
	function openEditDialog(id)
	{
		 var row=$("#content_table").getRowData(id);
		 $("#id").val(id)
		 for(var i=0;i<fieldIds.length;i++)
		 {
		 	$("#"+fieldIds[i]).val(row[fieldIds[i]])
		 }
		 $("#edit_unit_dialog").dialog("open");
	}
	function saveRecord()
	{
		$("#edit_unit_dialog").dialog("close");
		$.ajax({
			type:"post",
			url:"action.php?"+$("#editForm").serialize(),
			data:{
				action:"saveUnit"
			},
			dataType:"json",
			error:function(q,w,e){
				alert("All bed :(")
			},
			success:function(data){
				if(data.status!="ok")
				{
					alert(data.error)
					return;
				}
				if($("#id").val())
					jQuery("#content_table").jqGrid('setRowData',data.recordId,data.record);
				else
					jQuery("#content_table").jqGrid('addRowData',data.recordId,data.record);
			}
		})
	}
	function cancelEdit()
	{
		$("#edit_unit_dialog").dialog("close");
	}

</script>

		  <table id="content_table"><tr><td></td></tr></table> 
		  <div id="pager"></div> 
		  <div id="edit_unit_dialog">
		  	<form id="editForm">
		  		<input type="hidden" name="id" id="id"/>
		       <table>
		       	<tr>
		       		<td class="edit_field_name">Ед. изм.</td>
		       		<td class="edit_field"><input type="text" name="unit" id="unit"/></td>
		       	</tr>
		       	<tr>
		       		<td class="edit_field_name">Шаг изменения</td>
		       		<td class="edit_field"><input type="text" name="increment" id="increment"/></td>
		       	</tr>
		       	<tr>
		       		<td class="edit_field_name">Описание</td>
		       		<td class="edit_field">
		       			<textarea name="description" id="description">
		       			</textarea>
		       		</td>
		       	</tr>
		       </table>
		    </form>
		       <input type="button" value="Сохранить" onclick="saveRecord()">
		       <input type="button" value="Отменть" onclick="cancelEdit()">
		  </div>
		  